<template>
  <el-statistic
    class="statistic"
    group-separator=" "
    :precision="precision"
    :value="Number(value)"
    :style="valueStyle"
  >
    <!-- v-if="currency === 'KZT'" -->
    <template slot="suffix">&nbsp;{{ currencyType["KZT"].value }}</template>
    <!-- <template slot="prefix" v-else>
      {{ currencyType[currency || "KZT"].value }}
    </template> -->
  </el-statistic>
</template>
<script>
export default {
  props: {
    separator: {
      type: String,
      default: ",",
    },
    precision: {
      type: Number,
      default: 0,
    },
    value: {
      type: [String, Number],
      default: 0,
    },
    currency: {
      type: String,
      default: "",
    },
    valueStyle: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      currencyType: {
        CNY: {
          label: "人民币",
          value: "￥",
        },
        RUB: {
          label: "卢布",
          value: "₽",
        },
        USD: {
          label: "美元",
          value: "$",
        },
        KZT: {
          label: "坚戈",
          value: "₸",
        },
      },
    };
  },
  mounted() {},
};
</script>

<style scoped lang="scss">
@import "@/assets/css/variables.scss";
.statistic {
  display: inline-block;
  width: auto;
  color: $user--color-price;
  ::v-deep {
    .con {
      font-size: inherit !important;
      color: inherit !important;
      .number {
        font-size: inherit !important;
        color: inherit !important;
        padding: 0;
        text-indent: -2px;
      }
      .prefix,
      .suffix {
        padding: 0;
        //transform: scale(0.8);
      }
    }
  }
}
</style>
